<%@ page language="java" contentType="text/html;charset=UTF-8"
         pageEncoding="UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="zh-cn" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <%@include file="../../common/admin/common.jsp" %>
    <script type="text/javascript">
        $(function () {
            movic.index.initHomePage();
            movic.index.initNavigation();
            movic.index.menu.initDropdownMenuStyle();
            movic.index.menu.initMenuEvent();
        });
    </script>
</head>

<body class="no-skin">
<!-- #section:basics/navbar.layout -->
<div id="navbar" class="navbar navbar-default ace-save-state">
    <div class="navbar-container ace-save-state" id="navbar-container">
        <!-- #section:basics/sidebar.mobile.toggle -->
        <button type="button" class="navbar-toggle menu-toggler pull-left" id="menu-toggler" data-target="#sidebar">
            <span class="sr-only">Toggle sidebar</span>

            <span class="icon-bar"></span>

            <span class="icon-bar"></span>

            <span class="icon-bar"></span>
        </button>

        <!-- /section:basics/sidebar.mobile.toggle -->
        <div class="navbar-header pull-left">
            <!-- #section:basics/navbar.layout.brand -->
            <a href="#" class="navbar-brand">
                <small>
                    <i class="fa fa-leaf"></i>
                    Ps学习网站管理系统 ——— ${userEntity.role.name}
                </small>
            </a>

            <!-- /section:basics/navbar.layout.brand -->

            <!-- #section:basics/navbar.toggle -->

            <!-- /section:basics/navbar.toggle -->
        </div>

        <!-- #section:basics/navbar.dropdown -->
        <div class="navbar-buttons navbar-header pull-right" role="navigation">
            <ul class="nav ace-nav">
                <!-- #section:basics/navbar.user_menu -->
                <li class="light-blue dropdown-modal">
                    <a data-toggle="dropdown" href="#" class="dropdown-toggle">
                        <%--<img class="nav-user-photo" src="../assets/avatars/user.jpg" alt="Jason's Photo"/>--%>
                        <span class="user-info">
									<small>欢迎</small>
								</span>
                        <i class="ace-icon fa fa-caret-down"></i>
                    </a>

                    <ul class="user-menu dropdown-menu-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
                        <li>
                            <a href="${ctx}/logout.html"> <i class="ace-icon fa fa-power-off"></i>
                                安全退出
                            </a>
                        </li>
                    </ul>
                </li>
                <!-- /section:basics/navbar.user_menu -->
            </ul>
        </div>
        <!-- /section:basics/navbar.dropdown -->
    </div><!-- /.navbar-container -->
</div>

<!-- /section:basics/navbar.layout -->
<div class="main-container ace-save-state" id="main-container">
    <script type="text/javascript">
        try {
            ace.settings.loadState('main-container')
        } catch (e) {
        }
    </script>

    <!-- #section:basics/sidebar -->
    <div id="sidebar" class="sidebar responsive ace-save-state">
        <script type="text/javascript">
            try {
                ace.settings.loadState('sidebar')
            } catch (e) {
            }
        </script>
        <ul class="nav nav-list">
            <!-- 最多支持四级菜单 -->
            <c:forEach var="resource" items="${list}" varStatus="s">
                <!-- 一级 -->
                <li level="level1" class="">
                    <a href="javascript:void(0)" <c:if
                            test="${fn:length(resource.sourceUrl) gt 0 }"> nav-menu="${resource.name },${resource.sourceUrl }"</c:if>
                            <c:if test="${fn:length(resource.children) gt 0 }"> class="dropdown-toggle"</c:if>>
                        <i class="menu-icon fa ${resource.icon }"></i>
                        <span class="menu-text">${resource.name } </span>
                        <b class="arrow<c:if test="${fn:length(resource.children) gt 0 }"> fa fa-angle-down</c:if>"></b>
                    </a>
                    <b class="arrow"></b>
                    <c:if test="${fn:length(resource.children) gt 0 }">
                        <ul class="submenu">
                            <!-- 二级 -->
                            <c:forEach var="firstChildrens" items="${resource.children}" varStatus="idx1">
                                <li level="level2" class="">
                                    <a href="javascript:void(0)"
                                       <c:if test="${fn:length(firstChildrens.sourceUrl) gt 0 }">nav-menu="${resource.name },${firstChildrens.name },${firstChildrens.sourceUrl }"</c:if>
                                            <c:if test="${fn:length(firstChildrens.children) gt 0 }">
                                                class="dropdown-toggle"</c:if>>
                                        <i class="menu-icon fa fa-caret-right"></i> ${firstChildrens.name }
                                        <c:if test="${fn:length(firstChildrens.children) gt 0 }"><b
                                                class="arrow  fa fa-angle-down"></b></c:if>
                                    </a>
                                    <b class="arrow"></b>
                                    <c:if test="${fn:length(firstChildrens.children) gt 0 }">
                                        <ul class="submenu">
                                            <!-- 三级 -->
                                            <c:forEach var="secondChildrens" items="${firstChildrens.children}"
                                                       varStatus="idx2">
                                                <li level="level3" class="">
                                                    <a href="javascript:void(0)"
                                                       <c:if test="${fn:length(secondChildrens.sourceUrl) gt 0 }">nav-menu="${resource.name },${firstChildrens.name },${secondChildrens.name },${secondChildrens.sourceUrl }"</c:if>
                                                            <c:if test="${fn:length(secondChildrens.children) gt 0 }">
                                                                class="dropdown-toggle"</c:if>>
                                                        <i class="menu-icon <c:if test="${fn:length(secondChildrens.icon) gt 0 }">${secondChildrens.icon } green</c:if><c:if test="${fn:length(secondChildrens.icon) le 0 }">fa fa-caret-right</c:if>"></i> ${secondChildrens.name }
                                                        <c:if test="${fn:length(secondChildrens.children) gt 0 }"><b
                                                                class="arrow  fa fa-angle-down"></b></c:if>
                                                    </a>
                                                    <b class="arrow"></b>
                                                    <c:if test="${fn:length(secondChildrens.children) gt 0 }">
                                                        <ul class="submenu">
                                                            <!-- 四级 -->
                                                            <c:forEach var="thirdChildrens"
                                                                       items="${secondChildrens.children}"
                                                                       varStatus="idx3">
                                                                <li level="level4" class="">
                                                                    <a href="javascript:void(0)"
                                                                       <c:if test="${fn:length(thirdChildrens.sourceUrl) gt 0 }">nav-menu="${resource.name },${firstChildrens.name },${secondChildrens.name },${thirdChildrens.name },${thirdChildrens.sourceUrl }"</c:if>
                                                                            <c:if test="${fn:length(thirdChildrens.children) gt 0 }">
                                                                                class="dropdown-toggle"</c:if>>
                                                                        <i class="menu-icon <c:if test="${fn:length(thirdChildrens.icon) gt 0 }">${thirdChildrens.icon } orange</c:if><c:if test="${fn:length(thirdChildrens.icon) le 0 }">fa fa-caret-right</c:if>"></i> ${thirdChildrens.name }
                                                                    </a>
                                                                    <b class="arrow"></b>
                                                                </li>
                                                            </c:forEach>
                                                        </ul>
                                                    </c:if>
                                                </li>
                                            </c:forEach>
                                        </ul>
                                    </c:if>
                                </li>
                            </c:forEach>
                        </ul>
                    </c:if>
                </li>
            </c:forEach>

            <%--<li class="">--%>
            <%--<a href="#" class="dropdown-toggle">--%>
            <%--<i class="menu-icon fa fa-desktop"></i>--%>
            <%--<span class="menu-text">一级菜单</span>--%>
            <%--<b class="arrow fa fa-angle-down"></b>--%>
            <%--</a>--%>
            <%--<b class="arrow"></b>--%>
            <%--<ul class="submenu">--%>
            <%--<li class="">--%>
            <%--<a href="#" class="dropdown-toggle">--%>
            <%--<i class="menu-icon fa fa-caret-right"></i>--%>
            <%--二级--%>
            <%--<b class="arrow fa fa-angle-down"></b>--%>
            <%--</a>--%>
            <%--<b class="arrow"></b>--%>
            <%--<ul class="submenu">--%>
            <%--<li class="">--%>
            <%--<a href="#">--%>
            <%--<i class="menu-icon fa fa-leaf green"></i>--%>
            <%--三级--%>
            <%--</a>--%>
            <%--<b class="arrow"></b>--%>
            <%--</li>--%>
            <%--</ul>--%>
            <%--</li>--%>

            <%--<li class="">--%>
            <%--<a href="#" class="dropdown-toggle">--%>
            <%--<i class="menu-icon fa fa-caret-right"></i>--%>
            <%--Three Level Menu--%>
            <%--<b class="arrow fa fa-angle-down"></b>--%>
            <%--</a>--%>
            <%--<b class="arrow"></b>--%>
            <%--<ul class="submenu">--%>
            <%--<li class="">--%>
            <%--<a href="#">--%>
            <%--<i class="menu-icon fa fa-leaf green"></i>--%>
            <%--Item #1--%>
            <%--</a>--%>
            <%--<b class="arrow"></b>--%>
            <%--</li>--%>
            <%--<li class="">--%>
            <%--<a href="#" class="dropdown-toggle">--%>
            <%--<i class="menu-icon fa fa-pencil orange"></i>--%>
            <%--4th level--%>
            <%--<b class="arrow fa fa-angle-down"></b>--%>
            <%--</a>--%>
            <%--<b class="arrow"></b>--%>
            <%--<ul class="submenu">--%>
            <%--<li class="">--%>
            <%--<a href="#">--%>
            <%--<i class="menu-icon fa fa-plus purple"></i>--%>
            <%--Add Product--%>
            <%--</a>--%>
            <%--<b class="arrow"></b>--%>
            <%--</li>--%>

            <%--<li class="">--%>
            <%--<a href="#">--%>
            <%--<i class="menu-icon fa fa-eye pink"></i>--%>
            <%--View Products--%>
            <%--</a>--%>
            <%--<b class="arrow"></b>--%>
            <%--</li>--%>
            <%--</ul>--%>
            <%--</li>--%>
            <%--</ul>--%>
            <%--</li>--%>
            <%--</ul>--%>
            <%--</li>--%>

        </ul><!-- /.nav-list -->
        <!-- #section:basics/sidebar.layout.minimize -->
        <div class="sidebar-toggle sidebar-collapse" id="sidebar-collapse">
            <i id="sidebar-toggle-icon" class="ace-icon fa fa-angle-double-left ace-save-state"
               data-icon1="ace-icon fa fa-angle-double-left" data-icon2="ace-icon fa fa-angle-double-right"></i>
        </div>
        <!-- /section:basics/sidebar.layout.minimize -->
    </div>

    <!-- /section:basics/sidebar -->
    <div class="main-content">
        <div class="main-content-inner">
            <!-- #section:basics/content.breadcrumbs -->
            <div class="breadcrumbs ace-save-state" id="breadcrumbs">

                <ul class="breadcrumb"></ul><!-- /.breadcrumb -->

                <!-- #section:basics/content.searchbox -->
                <%--<div class="nav-search" id="nav-search">
                    <form class="form-search">
								<span class="input-icon">
									<input type="text" placeholder="Search ..." class="nav-search-input" id="nav-search-input" autocomplete="off" />
									<i class="ace-icon fa fa-search nav-search-icon"></i>
								</span>
                    </form>
                </div>--%>

            </div>
            <!-- /section:basics/content.breadcrumbs -->
            <div class="page-content"></div><!-- /.page-content -->

        </div>
    </div>
    <!-- /.main-content -->

    <div class="footer">
        <div class="footer-inner">
            <!-- #section:basics/footer -->
            <div class="footer-content">
                <span class="bigger-120">
                    <span class="blue bolder">Ace</span>
                    Application &copy; 2018-2019
                </span>
                &nbsp; &nbsp;
                <span class="action-buttons">
                    <a href="#">
                        <i class="ace-icon fa fa-twitter-square light-blue bigger-150"></i>
                    </a>
                    <a href="#">
                        <i class="ace-icon fa fa-facebook-square text-primary bigger-150"></i>
                    </a>
                    <a href="#">
                        <i class="ace-icon fa fa-rss-square orange bigger-150"></i>
                    </a>
                </span>
            </div>
            <!-- /section:basics/footer -->
        </div>
    </div>

    <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
        <i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
    </a>
</div><!-- /.main-container -->

<!-- ace scripts -->
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/elements.scroller.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/elements.colorpicker.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/elements.fileinput.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/elements.typeahead.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/elements.wysiwyg.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/elements.spinner.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/elements.treeview.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/elements.wizard.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/elements.aside.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.basics.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.scrolltop.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.ajax-content.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.touch-drag.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.sidebar.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.sidebar-scroll-1.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.submenu-hover.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.widget-box.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.settings.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.settings-rtl.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.settings-skin.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.widget-on-reload.js"></script>
<script type="text/javascript" src="${ctx}/resources/ace/assets/js/src/ace.searchbox-autocomplete.js"></script>
</body>

</html>
